<template>
  <div class="content-wrap">
    <van-nav-bar title="隐私设置" left-arrow @click-left="$router.go(-1)">
    </van-nav-bar>

    <div class="content">
      <van-cell-group class="checkGroup">
        <van-switch-cell v-model="friendCheck" title="加我为好友时需要验证" @change="editSetting('friendCheck')"/>
        <van-switch-cell v-model="numFindCheck" title="允许通过密聊号找到我" @change="editSetting('numFindCheck')"/>
        <van-switch-cell v-model="groupCheck" title="允许好友邀请我加群" @change="editSetting('groupCheck')"/>
      </van-cell-group>
    </div>
  </div>
</template>

<script>
  import Socket from '../../utils/socket'
  import { mapState } from 'vuex'

  export default {
    name: 'privacy',
    data () {
      return {
        friendCheck: false,
        numFindCheck: false,
        groupCheck: false
      }
    },
    computed: {
      ...mapState({
        userData: state => state.user.userData
      })
    },
    methods: {
      editSetting (type) {
        let flag = this[type] ? 1 : 2
        if (type === 'friendCheck') {
          Socket.sendData('setUserOnFAdd', { status: flag }).then(() => {
            this.$store.commit('setObjAttr', { obj: 'userData', attr: 'OnFAdd', data: this[type] })
          })
        } else if (type === 'numFindCheck') {
          Socket.sendData('setUserOnFSearch', { status: flag }).then(() => {
            this.$store.commit('setObjAttr', { obj: 'userData', attr: 'OnFSearch', data: this[type] })
          })
        } else if (type === 'groupCheck') {
          Socket.sendData('setUserOnGroup', { status: flag }).then(() => {
            this.$store.commit('setObjAttr', { obj: 'userData', attr: 'OnGroup', data: this[type] })
          })
        }
      }
    },
    created () {
      this.friendCheck = this.userData.OnFAdd
      this.numFindCheck = this.userData.OnFSearch
      this.groupCheck = this.userData.OnGroup
    }
  }
</script>

<style scoped>

</style>
